<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width,initial-scale=1" />
    <title>Elix MultiListBox</title>

    <link rel="stylesheet" href="demos.css" />
    <script type="module" src="../define/CheckListItem.js"></script>
    <script type="module" src="../define/MultiSelectListBox.js"></script>
  </head>

  <body role="main">
    <div class="demo medium">
      <elix-multi-select-list-box aria-label="Fruits" style="height: 100%">
        <elix-check-list-item value="acai">Acai</elix-check-list-item>
        <elix-check-list-item>Akee</elix-check-list-item>
        <elix-check-list-item>Apple</elix-check-list-item>
        <elix-check-list-item value="apricot">Apricot</elix-check-list-item>
        <elix-check-list-item value="avocado">Avocado</elix-check-list-item>
        <elix-check-list-item value="banana">Banana</elix-check-list-item>
        <elix-check-list-item value="bilberry">Bilberry</elix-check-list-item>
        <elix-check-list-item value="blacksapote"
          >Black sapote</elix-check-list-item
        >
        <elix-check-list-item value="blackberry"
          >Blackberry</elix-check-list-item
        >
        <elix-check-list-item value="blackcurrant"
          >Blackcurrant</elix-check-list-item
        >
        <elix-check-list-item value="bloodorange"
          >Blood orange</elix-check-list-item
        >
        <elix-check-list-item value="blueberry">Blueberry</elix-check-list-item>
        <elix-check-list-item value="boysenberry"
          >Boysenberry</elix-check-list-item
        >
        <elix-check-list-item value="cantaloupe"
          >Cantaloupe</elix-check-list-item
        >
        <elix-check-list-item value="cherimoya">Cherimoya</elix-check-list-item>
        <elix-check-list-item value="cherry">Cherry</elix-check-list-item>
        <elix-check-list-item value="chicofruit"
          >Chico fruit</elix-check-list-item
        >
        <elix-check-list-item value="clementine"
          >Clementine</elix-check-list-item
        >
        <elix-check-list-item value="cloudberry"
          >Cloudberry</elix-check-list-item
        >
        <elix-check-list-item value="coconut">Coconut</elix-check-list-item>
        <elix-check-list-item value="crabapple"
          >Crab apple</elix-check-list-item
        >
        <elix-check-list-item value="cranberry">Cranberry</elix-check-list-item>
        <elix-check-list-item value="cucumber">Cucumber</elix-check-list-item>
        <elix-check-list-item value="currant">Currant</elix-check-list-item>
        <elix-check-list-item value="damson">Damson</elix-check-list-item>
        <elix-check-list-item value="date">Date</elix-check-list-item>
        <elix-check-list-item value="dragonfruit"
          >Dragonfruit</elix-check-list-item
        >
        <elix-check-list-item value="durian">Durian</elix-check-list-item>
        <elix-check-list-item value="elderberry"
          >Elderberry</elix-check-list-item
        >
        <elix-check-list-item value="feijoa">Feijoa</elix-check-list-item>
        <elix-check-list-item value="fig">Fig</elix-check-list-item>
        <elix-check-list-item value="gojiberry"
          >Goji berry</elix-check-list-item
        >
        <elix-check-list-item value="gooseberry"
          >Gooseberry</elix-check-list-item
        >
        <elix-check-list-item value="grape">Grape</elix-check-list-item>
        <elix-check-list-item value="grapefruit"
          >Grapefruit</elix-check-list-item
        >
        <elix-check-list-item value="guava">Guava</elix-check-list-item>
        <elix-check-list-item value="honeyberry"
          >Honeyberry</elix-check-list-item
        >
        <elix-check-list-item value="honeydew">Honeydew</elix-check-list-item>
        <elix-check-list-item value="hornedmelon"
          >Horned melon</elix-check-list-item
        >
        <elix-check-list-item value="huckleberry"
          >Huckleberry</elix-check-list-item
        >
        <elix-check-list-item value="jabuticaba"
          >Jabuticaba</elix-check-list-item
        >
        <elix-check-list-item value="jackfruit">Jackfruit</elix-check-list-item>
        <elix-check-list-item value="jambul">Jambul</elix-check-list-item>
        <elix-check-list-item value="japaneseplum"
          >Japanese plum</elix-check-list-item
        >
        <elix-check-list-item value="jostaberry"
          >Jostaberry</elix-check-list-item
        >
        <elix-check-list-item value="jujube">Jujube</elix-check-list-item>
        <elix-check-list-item value="juniperberry"
          >Juniper berry</elix-check-list-item
        >
        <elix-check-list-item value="kiwifruit">Kiwifruit</elix-check-list-item>
        <elix-check-list-item value="kumquat">Kumquat</elix-check-list-item>
        <elix-check-list-item value="lemon">Lemon</elix-check-list-item>
        <elix-check-list-item value="lime">Lime</elix-check-list-item>
        <elix-check-list-item value="longan">Longan</elix-check-list-item>
        <elix-check-list-item value="loquat">Loquat</elix-check-list-item>
        <elix-check-list-item value="lychee">Lychee</elix-check-list-item>
        <elix-check-list-item value="mandarin">Mandarin</elix-check-list-item>
        <elix-check-list-item value="mango">Mango</elix-check-list-item>
        <elix-check-list-item value="mangosteen"
          >Mangosteen</elix-check-list-item
        >
        <elix-check-list-item value="marionberry"
          >Marionberry</elix-check-list-item
        >
        <elix-check-list-item value="miraclefruit"
          >Miracle fruit</elix-check-list-item
        >
        <elix-check-list-item value="mulberry">Mulberry</elix-check-list-item>
        <elix-check-list-item value="nance">Nance</elix-check-list-item>
        <elix-check-list-item value="nectarine">Nectarine</elix-check-list-item>
        <elix-check-list-item value="orange">Orange</elix-check-list-item>
        <elix-check-list-item value="papaya">Papaya</elix-check-list-item>
        <elix-check-list-item value="passionfruit"
          >Passionfruit</elix-check-list-item
        >
        <elix-check-list-item value="peach">Peach</elix-check-list-item>
        <elix-check-list-item value="pear">Pear</elix-check-list-item>
        <elix-check-list-item value="persimmon">Persimmon</elix-check-list-item>
        <elix-check-list-item value="pineapple">Pineapple</elix-check-list-item>
        <elix-check-list-item value="pineberry">Pineberry</elix-check-list-item>
        <elix-check-list-item value="plantain">Plantain</elix-check-list-item>
        <elix-check-list-item value="plum">Plum</elix-check-list-item>
        <elix-check-list-item value="pluot">Pluot</elix-check-list-item>
        <elix-check-list-item value="pomegranate"
          >Pomegranate</elix-check-list-item
        >
        <elix-check-list-item value="pomelo">Pomelo</elix-check-list-item>
        <elix-check-list-item value="purplemangosteen"
          >Purple mangosteen</elix-check-list-item
        >
        <elix-check-list-item value="quince">Quince</elix-check-list-item>
        <elix-check-list-item value="rambutan">Rambutan</elix-check-list-item>
        <elix-check-list-item value="raspberry">Raspberry</elix-check-list-item>
        <elix-check-list-item value="redcurrant"
          >Redcurrant</elix-check-list-item
        >
        <elix-check-list-item value="salak">Salak</elix-check-list-item>
        <elix-check-list-item value="salalberry"
          >Salal berry</elix-check-list-item
        >
        <elix-check-list-item value="salmonberry"
          >Salmonberry</elix-check-list-item
        >
        <elix-check-list-item value="satsuma">Satsuma</elix-check-list-item>
        <elix-check-list-item value="soursop">Soursop</elix-check-list-item>
        <elix-check-list-item value="starapple"
          >Star apple</elix-check-list-item
        >
        <elix-check-list-item value="starfruit"
          >Star fruit</elix-check-list-item
        >
        <elix-check-list-item value="strawberry"
          >Strawberry</elix-check-list-item
        >
        <elix-check-list-item value="surinamcherry"
          >Surinam cherry</elix-check-list-item
        >
        <elix-check-list-item value="tamarillo">Tamarillo</elix-check-list-item>
        <elix-check-list-item value="tamarind">Tamarind</elix-check-list-item>
        <elix-check-list-item value="tangerine">Tangerine</elix-check-list-item>
        <elix-check-list-item value="uglifruit"
          >Ugli fruit</elix-check-list-item
        >
        <elix-check-list-item value="watermelon"
          >Watermelon</elix-check-list-item
        >
        <elix-check-list-item value="whitecurrant"
          >White currant</elix-check-list-item
        >
        <elix-check-list-item value="whitesapote"
          >White sapote</elix-check-list-item
        >
        <elix-check-list-item value="yuzu">Yuzu</elix-check-list-item>
      </elix-multi-select-list-box>
    </div>
  </body>
</html>
